<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>满意度评价</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="../../../../static/struct/layuimini/lib/layui-v2.5.5/css/layui.css " media="all">
    <!--<script type="text/javascript" src="../../static/js/login/jquery.min.js"></script>-->
    <script src="../../../../static/js/generaljs/jquery-3.6.0.js"></script>
    <script src="../../../../static/js/generaljs/watermarkbycanvas.js" charset="UTF-8"></script>
    <link rel="stylesheet" href="../../../../static/css/generalcss/layuitablecheckboxfix.css">
    <script src="../../../../static/struct/layuimini/lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
</head>
<body onload="addWaterMarker()">
<!--
<p>Hello, <shiro:principal/>, how are you today?</p>
<p><shiro:user>guest</shiro:user></p>
<span th:text="${session.usercode}">人员工号</span>
-->
<br/>
<!-- http://127.0.0.1/extenalapi/assessByCustomer?cuserid=1001TR1000000000098D&projectOrTaskid=W-200325-0083 -->
<div class="layui-form" style='width:80%; margin:0 auto;'>
        <div class="layui-timeline-content layui-text" style="font-size: 30px; color: #000000">
            满意度评价及报告下载
            <i class="layui-icon layui-icon-download-circle" style="font-size: 25px; color: #000000;"></i>
        </div>
        <br />
        <div class="layui-timeline-content layui-text"><p>此页面为LIMSWEB端跳转页面，提供报告查看、下载、退回、满意度评价的服务。</p></div>
        <div class="layui-timeline-content layui-text" style="color: #FF5722"><p><b>注意：</b>本页面报告目前仅支持2021年6月4日及以后签发的报告</p></div>
        <div class="layui-timeline-content layui-text" style="color: #FF5722"><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;若需要2021年6月4日之前签发的报告，单项报告请在报告选择页面点选“旧版报告下载”，成套报告请联系1000514@hongfa.cn或1002437@hongfa.cn索取报告</p></div>
        <div class="layui-timeline-content layui-text" style="color: #FF5722"><p><b>重要说明：</b>由于Microsoft现已停止对Internet Explorer（IE浏览器）的支持，所以LIMS WEB端所有页面仅支持Chrome、Edge、Safari、Firefox为核心的浏览器</p></div>
        <div class="layui-timeline-content layui-text" style="color: #FF5722"><p><b>异常处理：</b>1、若用户无法打开页面或功能无效，请保证到宏发总部（10.0.11.168）网络畅通；2、将系统默认浏览器更改为上述几种浏览器之一</p></div>
        <div class="layui-timeline-content layui-text" style="color: #FF5722"><p><b>业务说明：</b>1、用户点击“下载报告”后，系统会自动收集满意度评价并结束流程（报告将无法驳回）；2、满意度为“不满意”、“非常不满意”或“报告驳回”时，系统会自动触发《不符合项处理流程》，用户可随时邮件跟踪不符合项处理进度，并可以在处理结束后下载最新版的报告</p></div>
        <hr class="layui-border-green">
        <div class="layui-form-item">
            <!--
            <ul th:each="c, State : ${assessList}">
                <li th:text="${c.taskcode}" ></li>
                <li th:text="${c.project}"></li>
            </ul>
            -->
            <ul class="layui-timeline">
                 <li class="layui-timeline-item">
                     <i class="layui-icon layui-timeline-axis"></i>
                     <div class="layui-timeline-content layui-text">
                         <h3 class="layui-timeline-title">步骤一 预览报告</h3>
                         <p>步骤一 选定委托单或任务单号</p>
                         <ul>
                             <li>此处单据编号为LIMS WEB端选定的委托单或任务单，禁止用户自行编辑</li>
                             <li>『查看预览』功能由系统自行判断用户所选择的委托单类型是成套报告或者单项报告</li>
                             <li>用户查看的报告，无论初次接收或驳回后接收的报告，均为当前系统最新版本的报告，过往版本的报告不予用户显示和查看</li>
                         </ul>
                     </div>
                     <div class="layui-inline" th:switch="${assessList.reportype}">
                         <input type="hidden" id="cuserid"  th:value="${assessList.cuserid}" >
                         <label class="layui-form-label">单据编号</label>
                         <div class="layui-input-inline" th:case="'单项'">
                             <input type="text" name="taskidinput" id="taskidinput" disabled autocomplete="off" class="layui-input" th:value="${assessList.taskcode}" >
                             <input type="hidden" id="reportypeid"  th:value="${assessList.reportype}" >
                         </div>
                         <div class="layui-input-inline" th:case="'成套'">
                             <input type="text" name="taskidinput" id="taskidinput" disabled autocomplete="off" class="layui-input" th:value="${assessList.project}">
                             <input type="hidden" id="reportypeid"  th:value="${assessList.reportype}" >
                         </div>
                         <button type="button" class="layui-btn" id="preViewReport">预览报告</button>
                         <button data-method="notice" type="button" class="layui-btn" id="rejectReport">报告驳回</button>
                     </div>
                 </li>
                <li class="layui-timeline-item">
                    <i class="layui-icon layui-timeline-axis"></i>
                    <div class="layui-timeline-content layui-text">
                        <h3 class="layui-timeline-title">步骤二 满意度评价</h3>
                        <p>步骤二 对步骤一中预览的报告进行满意度评价</p>
                        <ul>
                            <li>用户只有完成了满意度评价后才能发起『报告下载』的操作</li>
                            <li>请从『报告质量』和『报告及时性』两个方面进行评价</li>
                            <!--<li>在某种特殊情况，当用户已经做好满意度评价，但却退（驳）回了报告，下次再进入时无需再次进行满意度操作</li>-->
                            <li>每个方面的满意度评价都分为五个等级，由一星到五星分别为『非常不满意』、『不满意』、『一般』、『满意』、『非常满意』</li>
                            <li>当用户选择『非常不满意』或『不满意』时，系统会显示文本框，强制要求用户输入不满意原因(必填项)，用户可通过拖拉右下角改变可视区域大小</li>
                        </ul>
                        <div class="layui-inline">
                            <label class="layui-form-label">报告质量：</label>
                            <div id="assessQualityOprate"></div>
                            <div id="assessQualityReasonDiv" class="layui-inline" >
                                <!--<input type="text" name="assessQualityReason" placeholder="请输入不满意的原因，文本框可以通过拖拉右下角改变大小" id="assessQualityReasonId" autocomplete="off" class="layui-input"> -->
                                <textarea id="assessQualityReasonId" lay-verify="content" placeholder="请输入不满意的原因" name = "assessQualityReason" ></textarea>
                            </div>
                        </div>
                        <br />
                        <div class="layui-inline">
                             <label class="layui-form-label">及时性：</label>
                             <div id="assessAgingOprate"></div>
                             <div id="assessAgingReasonDiv" class="layui-inline" >
                                 <!--<input type="text" name="assessAgingReason" placeholder="请输入不满意的原因" id="assessQAgingReasonId" autocomplete="off" class="layui-input"> -->
                                 <textarea id="assessQAgingReasonId" lay-verify="content" placeholder="请输入不满意的原因" name = "assessAgingReason" ></textarea>
                             </div>
                        </div>
                    </div>
                </li>
                <li class="layui-timeline-item">
                    <i class="layui-icon layui-timeline-axis"></i>
                    <div class="layui-timeline-content layui-text">
                        <h3 class="layui-timeline-title">完成 报告下载</h3>
                        <button type="button" class="layui-btn" id="downloadReport">报告下载</button>
                    </div>
                </li>
            </ul>
        </div>
</div>


<script>

    layui.use(['rate','form', 'table','layer','laydate'], function(){
       var rate = layui.rate,
           $ = layui.jquery,
           form = layui.form,
           table = layui.table,
           util = layui.util,
           layer = layui.layer,
           laydate = layui.laydate;

        //获取当前页taskid
        let taskid = $("#taskidinput").val();
        let reportype = $("#reportypeid").val();
        let cuserid = $("#cuserid").val();

       /*
     满意度评价选星的效果
      */
       rate.render({
         elem : '#assessQualityOprate'
         ,value : 4
         ,text : true
         ,setText : function(value){
             var arrs = {'0':'尚未评价','1':'非常不满意','2':'不满意','3':'一般','4':'满意','5':'非常满意'};
             this.span.text(arrs[value] || ( value )  );
             switch (value) {
                case 1:$("#assessQualityReasonId").show(); break;
                case 2:$("#assessQualityReasonId").show(); break;
                case 3:$("#assessQualityReasonId").hide(); break;
                case 4:$("#assessQualityReasonId").hide(); break;
                case 5:$("#assessQualityReasonId").hide(); break;
                case 0:$("#assessQualityReasonId").hide(); break;
             }
           }
       });
        rate.render({
            elem : '#assessAgingOprate'
            ,value : 4
            ,text : true
            ,setText : function(agingvalue){
                var arrs = {'0':'尚未评价','1':'非常不满意','2':'不满意','3':'一般','4':'满意','5':'非常满意'};
                this.span.text(arrs[agingvalue] || ( agingvalue )  );
                switch (agingvalue) {
                    case 1:$("#assessQAgingReasonId").show(); break;
                    case 2:$("#assessQAgingReasonId").show(); break;
                    case 3:$("#assessQAgingReasonId").hide(); break;
                    case 4:$("#assessQAgingReasonId").hide(); break;
                    case 5:$("#assessQAgingReasonId").hide(); break;
                    case 0:$("#assessQAgingReasonId").hide(); break;
                }
            }
        });




        /**
         * 报告驳回按钮
         */
        $("#rejectReport").click(function(){
            /* 首先以模式对话框弹出要求输入驳回信息的界面，放置『确认驳回』与『取消』按钮
             * 确认驳回：ajax调用后台微服务，参数为用户输入的内容，返回Basresponse的数据，成功码为200
             * 取消：直接取消模式对话框返回
             * 限制逻辑：如果用户选择『确认驳回』，则需要验证用户输入内容trim后不得小于6个字符，6字符以下等同于用户未输入提示报错
             */
            layer.prompt({
                formType: 2,
                value: ' ',
                title: '请录入驳回原因并退回报告至签发人',
                closeBtn : false,
                area: ['500px', '300px'],
                id : 'rejectDialogId',
                scrollbar : false,
                anim: 2
            }, function(value, index, elem){
                //alert(value); //得到value
                //首先将得到的文本内容去空并判断是否大于等于6个字符
                //var rejectedResult = value.replace(/\s*/g,"");
                var rejectedResult = value.replace(/^\s*|\s*$/g,"");
                if (rejectedResult.length >= 10){
                    /* 驳回理由生效，开始回写BasResponse回调
                       直接调用controller，controller里包含两个服务
                       服务一：将labware流程驳回至签发状态，NC同步回写
                       服务二：将驳回理由写至数据
                       组合滚动事务，上述服务全部完成commit，否则rollback
                     */
                    var loading = layer.load(1);
                    var param = taskid + ':' + rejectedResult + ':' + reportype + ':' + cuserid;
                    $.ajax({
                        url: "/LimsWebControllers/rejectReportController?param=" + param,
                        type: 'post',
                        contentType: "application/json;charset=utf-8",
                        success: function(result) {
                            console.log(result)
                            //var json = eval(result);
                            if (result.code == '200'){
                                layer.close(loading);
                                parent.layer.msg('委托/任务单' + taskid  + '驳回成功！');
                            }else {
                                layer.close(loading);
                                parent.layer.alert('驳回失败，原因：' + result.msg);
                            }
                        }
                    });
                    layer.close(index);
                }else{
                    //驳回理由无效，返回界面，直接提示错误
                    layer.alert('驳回报告时，必须写明『驳回原因』且『驳回原因』不得少于10个字符(首尾空格无效)');
                    return;
                }
            });
        });

        /**
         * 报告预览按钮点击
         */
        $("#preViewReport").click(function(){
            /***
             *  1、首先查询input中的报告是否已签发，签发继续、未签发报错返回
             *  2、若已签发，去REPORT_SIGN_RECORD表查询记录
             *  3、去记录表取出blob，转换为pdf，前台接收，展示
             *  4、要求：不可复制、下载、另存为
             */
            var loading = layer.load(1);
            var param = taskid + ':' + reportype;
            var encodeUrl = encodeURIComponent("/preview/ReportServletController?param=" + param);
            var urlSrc="../static/pdfjs/web/viewer.html?file="+encodeUrl;
            window.open(urlSrc);
            layer.close(loading);
        });



        /**
         * 报告下载按钮动作
         */
        $("#downloadReport").click(function(){
            /**下载动作
             * 如果两项有任一不满意，且对应原因没写，不允许退回
             * 创建json，首先回写，然后打开报告
             */
            var object = {};
            object['billno'] = taskid;
            object['qualityscore'] = $("#assessQualityOprate").text();
            object['qualityreason'] = $("#assessQualityReasonId").val();
            object['agingscore'] = $("#assessQualityOprate").text();
            object['agingreason'] = $("#assessQAgingReasonId").val();
            object['reportype'] = reportype;
            object['rejectperson'] = cuserid;
            //var json = JSON.stringify(object);
            //console.log(taskid);
            if (($("#assessQualityOprate").text() == "不满意" || $("#assessQualityOprate").text() == "非常不满意") &&  $("#assessQualityReasonId").val().replace(/\s*/g,"").length < 10 ){
                layer.alert('请对『不满意原因』进行填写，且有效字符数不得少于10个字符(空格无效)');
                return;
            }
            if (($("#agingscore").text() == "不满意" || $("#agingscore").text() == "非常不满意") &&  $("#agingreason").val().replace(/\s*/g,"").length < 10 ){
                layer.alert('请对『不满意原因』进行填写，且有效字符数不得少于10个字符(空格无效)');
                return;
            }
            var loading = layer.load(1);
            $.ajax({
                url: "/LimsWebControllers/downloadReportController",
                type: 'post',
                contentType: "application/json;charset=utf-8",
                dataType: 'json',
                data: JSON.stringify(object),
                success: function(result) {
                    console.log(result)
                    //var json = eval(result);
                    if (result.code == '200'){
                        //parent.layer.msg('委托/任务单' + taskid  + '确认成功！');
                        var param = taskid + ':' + reportype;
                        var encodeUrl = encodeURIComponent("/preview/ReportServletController?param=" + param);
                        //var urlSrc="../static/pdfjs2/web/downloadandprint.html?file="+encodeUrl;
                        var urlSrc="../static/pdfjs2/web/viewer.html?file="+encodeUrl;
                        window.open(urlSrc);
                        layer.close(loading);
                    }else {
                        layer.close(loading);
                        parent.layer.alert('驳回失败，原因：' + result.msg);
                    }
                }
            });




        });

    });

    /**
     * 满意度点击事件
     * alert($("#assessQualityOprate").text());
     * alert($("#assessAgingOprate").text());
     * 质量满意度
     * 及时性满意度
     */
    /*
    $("#assessQualityOprate").click(function(){
        if ($("#assessQualityOprate").text() != '非常不满意' || $("#assessAgingOprate").text() != '不满意' ){
            alert($("#assessQualityReasonId").val());
            $("#downloadReport").removeClass('layui-btn-disabled');
            $("#downloadReport").attr("disabled",false);
        }else{
            $("#downloadReport").addClass('layui-btn-disabled');
            $("#downloadReport").attr("disabled",true);
        }
    });
    $("#assessAgingOprate").click(function(){
        if ($("#assessQualityOprate").text() != '尚未评价' && $("#assessAgingOprate").text() != '尚未评价'){
            $("#downloadReport").removeClass('layui-btn-disabled');
            $("#downloadReport").attr("disabled",false);
        }else{
            $("#downloadReport").addClass('layui-btn-disabled');
            $("#downloadReport").attr("disabled",true);
        }
    });
    */



</script>
</body>
</html>